import React, {PureComponent} from "react";
import {Form, Input, Button, Tag} from 'antd';
import {extend} from "umi-request";

const Item = Form.Item;
export default class TagList extends PureComponent {

  state = {
    color: '',
    text: ''
  }

  onFinish = values => {
    console.log('Success:', values);
  };

  onChange = values => {
    const target = values.currentTarget;
    let input = target.querySelector("input");
    const obj = {};
    obj[input.id] = input.value;
    this.setState(obj);
  };

  render() {
    return (

      <div>
        <Tag color={this.state.color}>{this.state.text}</Tag>
        <Form onFinish={this.onFinish}>
          <Item name='color' onChange={this.onChange}>
            <Input/>
          </Item>
          <Item name='text' onChange={this.onChange}>
            <Input/>
          </Item>
        </Form>

      </div>);
  }


}

